<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<!-- <link rel="stylesheet" href="@/utils/leaflet.css" type="text/css">
	<script src="@/utils/leaflet.js"></script>-->
		<title>Document</title>
		<!-- 引入 文件 -->
		<link rel="stylesheet" href="./css/leaflet.css" />
		<!-- 增加地图高度 -->
		<style>
			#mapDiv {
				height: 300px;
			}
		</style>
	</head>
	<body>
		<!-- 创建一个 地图的div id 必须有 但是自定义 -->
		<div id="mapDiv"></div>
		<script src="./js/leaflet.js"></script>
		<script src="./js/proj4-compressed.js"></script>
		<script src="./js/proj4leaflet.js"></script>
		<script>
			
			const CRS_4490 = new L.Proj.CRS("EPSG:4490", "+proj=longlat +ellps=GRS80 +no_defs", {
			  resolutions: [
			      1.40625,
			      0.703125,
			      0.3515625,
			      0.17578125,
			      0.087890625,
			      0.0439453125,
			      0.02197265625,
			      0.010986328125,
			      0.0054931640625,
			      0.00274658203125,
			      0.001373291015625,
			      6.866455078125E-4,
			      3.4332275390625E-4,
			      1.71661376953125E-4,
			      8.58306884765625E-5,
			      4.291534423828125E-5,
			      2.1457672119140625E-5,
			      1.0728836059570312E-5,
			      5.364418029785156E-6,
			      2.682209064925356E-6,
			      1.3411045324626732E-6
			  ],
			  origin: [-180, 90]
			});
			
			var map = L.map('mapDiv', {
			  // center: [39.750837, 116.148174],
			  center: [31.9137, 116.1733],
			  zoom: 14,
			  crs: CRS_4490
			})
			L.tileLayer(
				'https://fxpc.mem.gov.cn/data_preparation/a12eadf6-1a57-43fe-9054-2e22277bd553/4eb4b664-5633-4ab3-b0fd-345829dd3a87/wmts?layer=img&style=default&tileMatrixSet=c&service=wmts&request=gettile&version=1.0.0&format=tiles&tileMatrix={z}&tileCol={x}&tileRow={y}&geokey=2CA54B6D242305ABF3822EC38D121CD9'
			).addTo(map);
			L.tileLayer(
				'https://fxpc.mem.gov.cn/data_preparation/a12eadf6-1a57-43fe-9054-2e22277bd553/83e5b643-edc3-4118-ba04-2a9186606b42/wmts?layer=cia&style=default&tileMatrixSet=c&service=wmts&request=gettile&version=1.0.0&format=tiles&tileMatrix={z}&tileCol={x}&tileRow={y}&geokey=2CA54B6D242305ABF3822EC38D121CD9'
			).addTo(map);
		
		</script>
	</body>
</html>
